<template>
  <div class="bmap-custom-js-document-container">

    <div class="code-item">
      <p class="title">地图相关实例</p>
      <div>
        <p><Tag color="primary">this.map</Tag>指向当前组件地图实例</p>
        <p><Tag color="primary">this.view</Tag>指向当前组件地图View实例</p>
        <slot name="custom-code-item"></slot>
      </div>
    </div>
    <Collapse>
      <Panel>
        百度地图相关全局对象
        <div slot="content">
          <div class="code-item">
            <div>
              <p><Tag color="success">BMapGL</Tag>百度地图API核心类，等同Map</p>
              <p><Tag color="success">mapvgl</Tag>百度地图可视化核心类</p>
            </div>
          </div>
        </div>
      </Panel>
    </Collapse>
  </div>
</template>

<script>
export default {
  name: "BMapCustomJsDocument"
}
</script>

<style lang="less" scoped>
  .bmap-custom-js-document-container {
    width: 100%;
    height: auto;
    background-color: #616161;
    border: 2px solid #424242;
    border-radius: 4px;
    color: #fff;
    padding: 10px;
    .code-item {
      margin-bottom: 5px;
      &:last-child {
        margin-bottom: 0px;
      }
      .title {
        margin: 0px 0px 5px 0px;
      }
    }
  }
</style>
